// 针对 axios 做封装

// 1. 引入 axios
import axios from "axios";
/**
 * 引入 store
 *    组件内可以使用 this.$store
 *    别的文件中如果要使用 store 对象的话，就直接引入 store 文件即可。
 */
import store from "@/store";

// 2. 创建 axios 实例, 配置一些配置项
const myAxios = axios.create({
  timeout: 10000, // 超时时间
});

// 3. 请求拦截器
//    TODO: 后续被请求头中都添加上 token
myAxios.interceptors.request.use(
  function (config) {
    console.log("请求拦截器", config);
    // ... config.headers.token = 'xxxx'
    // xxxx 要么从vuex中获取，要么从 本地存储中获取
    config.headers.Authorization = store.state.token;
    return config;
  },
  function (error) {
    // ...
    return Promise.reject(error);
  }
);

// 4. 响应拦截器
//    将 response.data 处理一下
myAxios.interceptors.response.use(
  function (response) {
    console.log("响应拦截器", response);
    // ...
    return response;
  },
  function (error) {
    // ...
    return Promise.reject(error);
  }
);

// 命名导出
export const http = (url) => {
  return myAxios({
    url,
    method: "GET",
  });
};

// 最后，暴露这个 myAxios
export default myAxios;
